import 'package:music_player/model/musci_model.dart';
import 'package:music_player/model/theme_model.dart';
import 'package:music_player/widget/MusicBar.dart';
import 'package:music_player/widget/MusicCore.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class MusicPage extends StatelessWidget {
  const MusicPage({super.key});

  @override
  Widget build(BuildContext context) {
    final themeModel = context.watch<ThemeModel>();
    return AnimatedContainer(
      decoration: BoxDecoration(
        gradient: LinearGradient(colors: themeModel.bgColor,begin: Alignment.bottomRight,end: Alignment.topLeft)
      ),
      duration: const Duration(seconds: 1),
      child: const Column(
        mainAxisAlignment: MainAxisAlignment.end,
        children: [
          Expanded(child: MusicCore()),
          MusicSlider(),
          MusicBar(),
        ],
      ),
    );
  }
}

class MusicSlider extends StatefulWidget {
  const MusicSlider({super.key});

  @override
  State<MusicSlider> createState() => _MusicSliderState();
}

class _MusicSliderState extends State<MusicSlider> {
  @override
  Widget build(BuildContext context) {
    final musicModel = context.watch<MusicModel>();
    return Container(
      color: Colors.lightGreen,
      child: SliderTheme(
        data: SliderTheme.of(context).copyWith(
          trackHeight: 5.0, // 可以设置滑块的高度
          overlayShape: SliderComponentShape.noOverlay, // 移除滑块的点击扩展范围
          thumbShape: RoundSliderThumbShape(enabledThumbRadius:0.0 ), // 自定义滑块的thumb形状
        ),
        child: Slider(
          min: 0,
          max: musicModel.musicLength+100, // 由于转化问题精度丢失，+1扩充一下精度
          value: musicModel.playLength,
          onChanged: (double value) {
            musicModel.playLength = value;
          },
          onChangeStart: (double value){
            print("start:$value");
            musicModel.isSliver = true;
          },
          onChangeEnd: (double value){
            print("end:$value");
            musicModel.isSliver = false;
            musicModel.seekMusic(value);
          },
        ),
      ),
    );
  }
}
